import request from '@/utils/request';
import styles from './index.less';
import { Statistic, Card, Row, Col } from 'antd';
import React,{useState,useEffect} from "react";

export default () => {
  const[data,dataUpdate] = useState({})
  useEffect(()=>{
    request("/api/index/get").then(res=>{
      if (res.Code != 0 ){
        console.log(res.Msg)
      }
      console.log(res)
      dataUpdate(res.Data)
    })
  },[])

  return (
    <>
      <div className={styles.report}>
        <div className="site-statistic-demo-card">
          <Row gutter={16}>
            <Col span={12}>
              <Card>
                <Statistic
                  title="节点号"
                  value={data.MinerAddress}
                  valueStyle={{ color: '#3f8600' }}
                />
              </Card>
            </Col>
            <Col span={12}>
              <Card>
                <Statistic
                  title="总算力"
                  value={data.QualityAdjPowerFloat}
                  precision={2}
                  valueStyle={{ color: '#3f8600' }}
                  suffix="Tib"
                />
              </Card>
            </Col>
          </Row>
        </div>
        <div className="site-statistic-demo-card">
          <Row gutter={16}>
            <Col span={12}>
              <Card>
                <Statistic
                  title="累计出块奖励"
                  value={data.RewardNumsFloat}
                  precision={2}
                  valueStyle={{ color: '#3f8600' }}
                  suffix="FIL"
                />
              </Card>
            </Col>
            <Col span={12}>
              <Card>
                <Statistic
                  title="累计出块数"
                  value={data.RewardCount}
                  valueStyle={{ color: '#3f8600' }}
                  suffix=""
                />
              </Card>
            </Col>

          </Row>
        </div>
        <div className="site-statistic-demo-card">
          <Row gutter={16}>
            <Col span={12}>
              <Card>
                <Statistic
                  title="Worker可用余额"
                  value={data.WorkerBalanceFloat}
                  precision={2}
                  valueStyle={{ color: '#3f8600' }}
                  suffix="FIL"
                />
              </Card>
            </Col>
            <Col span={12}>
              <Card>
                <Statistic
                  title="controller可用余额"
                  value={data.ControlBalanceFloat}
                  precision={2}
                  valueStyle={{ color: '#3f8600' }}
                  suffix="FIL"
                />
              </Card>
            </Col>
          </Row>
        </div>
        <div className="site-statistic-demo-card">
          <Row gutter={16}>
            <Col span={12}>
              <Card>
                <Statistic
                  title="账户余额"
                  value={data.TotalBalanceFloat}
                  precision={2}
                  valueStyle={{ color: '#3f8600' }}
                  suffix="FIL"
                />
              </Card>
            </Col>
            <Col span={12}>
              <Card>
                <Statistic
                  title="时间"
                  value={data.TimeString}
                  valueStyle={{ color: '#3f8600' }}
                  suffix=""
                />
              </Card>
            </Col>

          </Row>
        </div>
      </div>

    </>
  )
}
